﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="AvanceProyectos.aspx.cs"
    Inherits="entgp.Estadisticas.AvanceProyectos" %>

<%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <ext:ScriptManager runat="server" Theme="Slate">
    </ext:ScriptManager>
    <form id="form1" runat="server">

    <script type="text/javascript">
        function prepareCommand(grid, command, record, row) {
            // tramite ejecucion terminado detenido
           
            if (command.command == 'tramite' && (record.data.Estado == 'En Ejecución' || record.data.Estado == 'Finalizado' || record.data.Estado == 'Paralizado')) {
                command.hidden = true;
                command.hideMode = 'visibility'; //you can try 'display' also
            }
            if (command.command == 'ejecucion' && (record.data.Estado == 'En Tramite' || record.data.Estado == 'Finalizado' || record.data.Estado == 'Paralizado')) {
                command.hidden = true;
                //command.hideMode = 'visibility'; //you can try 'display' also
            }
            if (command.command == 'terminado' && (record.data.Estado == 'En Ejecución' || record.data.Estado == 'En Tramite' || record.data.Estado == 'Paralizado')) {
                command.hidden = true;
                //command.hideMode = 'visibility'; //you can try 'display' also
            }
            if (command.command == 'detenido' && (record.data.Estado == 'En Ejecución' || record.data.Estado == 'Finalizado' || record.data.Estado == 'En Tramite')) {
                command.hidden = true;
                command.hideMode = 'visibility'; //you can try 'display' also                 
            }
        }
    </script>

    <ext:Store ID="StoreProgramas" runat="server">
        <Reader>
            <ext:JsonReader ReaderID="Key">
                <Fields>
                    <ext:RecordField Name="Value">
                    </ext:RecordField>
                    <ext:RecordField Name="Key">
                    </ext:RecordField>
                </Fields>
            </ext:JsonReader>
        </Reader>
    </ext:Store>
    <ext:Store ID="StoreEstado" runat="server">
        <Reader>
            <ext:JsonReader ReaderID="Key">
                <Fields>
                    <ext:RecordField Name="Value">
                    </ext:RecordField>
                    <ext:RecordField Name="Key">
                    </ext:RecordField>
                </Fields>
            </ext:JsonReader>
        </Reader>
    </ext:Store>
    <ext:Store ID="StoreEje" runat="server">
        <Reader>
            <ext:JsonReader ReaderID="Key">
                <Fields>
                    <ext:RecordField Name="Value">
                    </ext:RecordField>
                    <ext:RecordField Name="Key">
                    </ext:RecordField>
                </Fields>
            </ext:JsonReader>
        </Reader>
    </ext:Store>
    <ext:Store ID="StoreTipo" runat="server">
        <Reader>
            <ext:JsonReader ReaderID="Key">
                <Fields>
                    <ext:RecordField Name="Value">
                    </ext:RecordField>
                    <ext:RecordField Name="Key">
                    </ext:RecordField>
                </Fields>
            </ext:JsonReader>
        </Reader>
    </ext:Store>
    <ext:Store ID="StoreProyectos" runat="server">
        <Reader>
            <ext:JsonReader ReaderID="Id">
                <Fields>
                    <ext:RecordField Name="Id" />
                    <ext:RecordField Name="Nombre" />
                    <ext:RecordField Name="FechaInicio" Type="Date" DateFormat="Y-m-dTh:i:s" />
                    <ext:RecordField Name="FechaFin" Type="Date" DateFormat="Y-m-dTh:i:s" />
                    <ext:RecordField Name="Presupuesto" />
                    <ext:RecordField Name="Descripcion" />
                    <ext:RecordField Name="Saldo" />
                    <ext:RecordField Name="UltimoPago" />
                    <ext:RecordField Name="AportePlan" />
                    <ext:RecordField Name="AportePlanConDescuento" />
                    <ext:RecordField Name="TotalDesembolsado" />
                    <ext:RecordField Name="PorcentajeAvance" />
                    <ext:RecordField Name="Estado" />
                    <ext:RecordField Name="NumeroDias" />
                    <ext:RecordField Name="DiasTranscurridos" />
                    <ext:RecordField Name="DiasFaltantes" />
                    <ext:RecordField Name="PorcentajeDias" />
                    <ext:RecordField Name="PorcentajeDesembolso" />
                </Fields>
            </ext:JsonReader>
        </Reader>
    </ext:Store>
    <ext:ViewPort ID="ViewPort1" runat="server">
        <Body>
            <ext:BorderLayout ID="BorderLayout1" runat="server">
                <North Collapsible="True" Split="false">
                    <ext:Panel ID="Panel1" BodyStyle="padding:10px;background-color:#E7E4DD;" runat="server"
                        AutoHeight="true">
                        <Body>
                            <ext:Panel ID="Panel2" runat="server" BodyStyle="background-color:Transparent;" ButtonAlign="Center">
                                <Body>
                                    <ext:ColumnLayout ID="ColumnLayout1" runat="server">
                                        <ext:LayoutColumn ColumnWidth=".33">
                                            <ext:Panel ID="Panel3" runat="server" Border="false" Header="false" BodyStyle="padding:10px;background-color:Transparent;">
                                                <Body>
                                                    <ext:FormLayout ID="FormLayout1" runat="server" LabelAlign="Left" LabelWidth="70">
                                                        <ext:Anchor Horizontal="95%">
                                                            <ext:ComboBox Editable="false" FieldLabel="Eje" ID="cbxEje" StoreID="StoreEje" runat="server"
                                                                DisplayField="Value" ValueField="Key" TypeAhead="true" ForceSelection="true"
                                                                TriggerAction="All" Grow="true" GrowMax="300" EmptyText="Todos" SelectOnFocus="true"
                                                                AutoDataBind="True">
                                                                <Triggers>
                                                                    <ext:FieldTrigger Icon="Clear" HideTrigger="true" />
                                                                </Triggers>
                                                                <Listeners>
                                                                    <Select Handler="this.triggers[0].show();" />
                                                                    <BeforeQuery Handler="this.triggers[0][ this.getRawValue().toString().length == 0 ? 'hide' : 'show']();" />
                                                                    <TriggerClick Handler="if(index == 0) { this.clearValue(); this.triggers[0].hide(); }" />
                                                                </Listeners>
                                                            </ext:ComboBox>
                                                        </ext:Anchor>
                                                        <ext:Anchor Horizontal="95%">
                                                            <ext:ComboBox Editable="false" FieldLabel="Estado" ID="cbxEstado" runat="server"
                                                                StoreID="StoreEstado" DisplayField="Value" ValueField="Key" TypeAhead="true"
                                                                ForceSelection="true" TriggerAction="All" Grow="true" GrowMax="300" EmptyText="Todos"
                                                                SelectOnFocus="true" AutoDataBind="True">
                                                                <Triggers>
                                                                    <ext:FieldTrigger Icon="Clear" HideTrigger="true" />
                                                                </Triggers>
                                                                <Listeners>
                                                                    <Select Handler="this.triggers[0].show();" />
                                                                    <BeforeQuery Handler="this.triggers[0][ this.getRawValue().toString().length == 0 ? 'hide' : 'show']();" />
                                                                    <TriggerClick Handler="if(index == 0) { this.clearValue(); this.triggers[0].hide(); }" />
                                                                </Listeners>
                                                            </ext:ComboBox>
                                                        </ext:Anchor>
                                                    </ext:FormLayout>
                                                </Body>
                                            </ext:Panel>
                                        </ext:LayoutColumn>
                                        <ext:LayoutColumn ColumnWidth=".34">
                                            <ext:Panel ID="Panel4" Height="70" runat="server" Border="false" BodyStyle="padding:10px;background-color:Transparent;">
                                                <Body>
                                                    <ext:FormLayout ID="FormLayout2" LabelSeparator=":" runat="server" LabelAlign="Left"
                                                        LabelWidth="65">
                                                        <ext:Anchor Horizontal="95%">
                                                            <ext:ComboBox Editable="false" FieldLabel="Programa" ID="cbxProgramas" runat="server"
                                                                StoreID="StoreProgramas" DisplayField="Value" ValueField="Key" TypeAhead="true"
                                                                ForceSelection="true" TriggerAction="All" Grow="true" GrowMax="300" EmptyText="Todos"
                                                                SelectOnFocus="true" AutoDataBind="True">
                                                                <Triggers>
                                                                    <ext:FieldTrigger Icon="Clear" HideTrigger="true" />
                                                                </Triggers>
                                                                <Listeners>
                                                                    <Select Handler="this.triggers[0].show();" />
                                                                    <BeforeQuery Handler="this.triggers[0][ this.getRawValue().toString().length == 0 ? 'hide' : 'show']();" />
                                                                    <TriggerClick Handler="if(index == 0) { this.clearValue(); this.triggers[0].hide(); }" />
                                                                </Listeners>
                                                            </ext:ComboBox>
                                                        </ext:Anchor>
                                                        <ext:Anchor Horizontal="95%">
                                                            <ext:TextField FieldLabel="Nombre" ID="txtNombrePrograma" runat="server" />
                                                        </ext:Anchor>
                                                    </ext:FormLayout>
                                                </Body>
                                            </ext:Panel>
                                        </ext:LayoutColumn>
                                        <ext:LayoutColumn ColumnWidth=".33">
                                            <ext:Panel ID="Panel5" Height="70" runat="server" Border="false" BodyStyle="padding:10px;background-color:Transparent;">
                                                <Body>
                                                    <ext:FormLayout ID="FormLayout3" LabelSeparator=":" runat="server" LabelAlign="Left"
                                                        LabelWidth="50">
                                                        <ext:Anchor Horizontal="95%">
                                                            <ext:ComboBox Editable="false" FieldLabel="Tipo" ID="cbxCategorias" StoreID="StoreTipo"
                                                                runat="server" DisplayField="Value" ValueField="Key" TypeAhead="true" ForceSelection="true"
                                                                TriggerAction="All" Grow="true" GrowMax="300" EmptyText="Todos" SelectOnFocus="true"
                                                                AutoDataBind="True">
                                                                <Triggers>
                                                                    <ext:FieldTrigger Icon="Clear" HideTrigger="true" />
                                                                </Triggers>
                                                                <Listeners>
                                                                    <Select Handler="this.triggers[0].show();" />
                                                                    <BeforeQuery Handler="this.triggers[0][ this.getRawValue().toString().length == 0 ? 'hide' : 'show']();" />
                                                                    <TriggerClick Handler="if(index == 0) { this.clearValue(); this.triggers[0].hide(); }" />
                                                                </Listeners>
                                                            </ext:ComboBox>
                                                        </ext:Anchor>
                                                    </ext:FormLayout>
                                                </Body>
                                            </ext:Panel>
                                        </ext:LayoutColumn>
                                    </ext:ColumnLayout>
                                </Body>
                                <Buttons>
                                    <ext:Button runat="server" ID="btnBuscar" Text="Buscar" Icon="Find">
                                        <AjaxEvents>
                                            <Click OnEvent="btnBuscar_Click">
                                                <EventMask ShowMask="true" />
                                            </Click>
                                        </AjaxEvents>
                                    </ext:Button>
                                </Buttons>
                            </ext:Panel>
                        </Body>
                    </ext:Panel>
                </North>
                <Center>
                    <ext:GridPanel ID="GridPanelProyectos" runat="server" StoreID="StoreProyectos" StripeRows="true"
                        AutoWidth="true" Height="250px" Title="Proyectos" AutoExpandColumn="NombreProyecto">
                        <ColumnModel ID="ColumnModel1" runat="server">
                            <Columns>
                                <ext:Column ColumnID="NombreProyecto" Header="Nombre del proyecto" Width="200" Sortable="true"
                                    DataIndex="Nombre" />
                                <ext:Column ColumnID="Descripcion" Header="Descripcion" Width="150" Sortable="true"
                                    DataIndex="Descripcion" Hidden="true" />
                                <ext:Column Header="Fecha Inicio" Width="145" Sortable="true" DataIndex="FechaInicio">
                                    <Renderer Fn="Ext.util.Format.dateRenderer('j \\de F \\de\\l Y')" />
                                </ext:Column>
                                <ext:Column Header="Fecha Fin" Width="145" Sortable="true" DataIndex="FechaFin">
                                    <Renderer Fn="Ext.util.Format.dateRenderer('j \\de F \\de\\l Y')" />
                                </ext:Column>
                                <ext:Column Header="Estado" Width="90" Sortable="true" DataIndex="Estado" />
                                <ext:Column Header="Presupuesto" Width="100" Sortable="true" DataIndex="Presupuesto">
                                    <Renderer Format="UsMoney" />
                                </ext:Column>
                                <ext:Column Header="Aporte Plan" Width="100" Sortable="true" DataIndex="AportePlanConDescuento">
                                    <Renderer Format="UsMoney" />
                                </ext:Column>
                                <ext:Column Header="Total desembolsado" Width="110" Sortable="true" DataIndex="TotalDesembolsado">
                                    <Renderer Format="UsMoney" />
                                </ext:Column>
                                <%--<ext:Column Header="Ultimo Pago" Width="140" Sortable="true" DataIndex="UltimoPago">
                                <Renderer Format="UsMoney" /> 
                            </ext:Column>--%>
                                <ext:ImageCommandColumn>
                                    <Commands>
                                        <ext:ImageCommand CommandName="tramite" Icon="Hourglass">
                                            <ToolTip Text="Proyecto en Tramite" />
                                        </ext:ImageCommand>
                                        <ext:ImageCommand CommandName="ejecucion" Icon="CogGo">
                                            <ToolTip Text="Proyecto en Ejecución" />
                                        </ext:ImageCommand>
                                        <ext:ImageCommand CommandName="terminado" Icon="Accept">
                                            <ToolTip Text="Proyecto Terminado" />
                                        </ext:ImageCommand>
                                        <ext:ImageCommand CommandName="detenido" Icon="Stop">
                                            <ToolTip Text="Proyecto Paralizado" />
                                        </ext:ImageCommand>
                                    </Commands>
                                    <PrepareCommand Fn="prepareCommand" />
                                </ext:ImageCommandColumn>
                            </Columns>
                        </ColumnModel>
                        <%--<AjaxEvents>
                        <Command OnEvent="VerDesembolso">
                            <ExtraParams>
                                <ext:Parameter Name="Comando" Value="command" Mode="Raw" Encode="False" />
                                <ext:Parameter Name="Id" Value="record.data.Id" Mode="Raw" />
                            </ExtraParams>
                        </Command>
                    </AjaxEvents>--%>
                        <SelectionModel>
                            <ext:RowSelectionModel ID="RowSelectionModel1" runat="server" SingleSelect="true" />
                        </SelectionModel>
                        <Plugins>
                            <ext:RowExpander ID="RowExpander1" runat="server" Collapsed="true">
                                <Template ID="Template1" runat="server">
                                    <br/> <p style=" font-size:15px;"><b>Descripci&oacute;n:</b> {Descripcion}</p><br/> 
                                    <br/> <p style=" font-size:15px;"><b>Porcentaje Desembolsado:</b> {PorcentajeDesembolso}%</p><br/> 
                                    <p style="font-size:15px;"><b>Tiempo de Duraci&oacute;n del proyecto</b> {NumeroDias} dias</p> <br/> 
                                    <p style="font-size:15px;"><b>Dias Transcurridos</b> {DiasTranscurridos}</p> <br/> 
                                    <p style="font-size:15px;"><b>Dias Faltantes</b> {DiasFaltantes}</p> <br/> 
                                    <p style="font-size:15px;"><b>Porcentaje Dias</b> {PorcentajeDias}%</p> <br/> 
                                    <p style="font-size:15px;"><b>Porcentaje de Avance</b> {PorcentajeAvance}%</p>  <br/> 
                                </Template>
                            </ext:RowExpander>
                        </Plugins>
                        <BottomBar>
                            <ext:PagingToolbar ID="ptbPerfilProyecto" runat="server" StoreID="StoreProyectos"
                                DisplayInfo="true" DisplayMsg="Proyectos {0} - {1} of {2}" EmptyMsg="No existen Proyectos" />
                        </BottomBar>
                    </ext:GridPanel>
                </Center>
            </ext:BorderLayout>
        </Body>
    </ext:ViewPort>
    </form>
</body>
</html>
